<template>
    <el-dialog
      class="eldialog"
      :visible.sync="visible"
      :title="title"
      :close-on-click-modal="false"
      width="40%"
      top="2vh"
      append-to-body
      @close='closeDialog'
      v-loading="loading"
      :close-on-press-escape="false"
    >
      <div style="height: 440px;overflow-y: auto;overflow-x: hidden">
        <el-tree
          ref="tree"
          :props="props"
          :load="loadNode"
          node-key="id"
          :default-checked-keys="checkedId"
          lazy
          show-checkbox>
        </el-tree>
      </div>
      <template slot="footer">
        <el-button type="success" size="medium" @click="onSubmit">保存</el-button>
        <el-button type="danger" size="medium" @click="visible = false">取消</el-button>
      </template>
    </el-dialog>
  </template>
  
  <script>
      import VJstree from 'vue-jstree'
      import { updateRoleSetDept,getRoleDepts} from "@/api/datacentersg/achives/documentApi";
      import {saveAssignRole} from '@/api/young/system/role/role.js'
      import {getTreeByRole} from '@/api/young/datacenter/person.js'
  
      export default {
          name: 'ModuleTree',
          components: {
              VJstree
          },
          data() {
              return {
                  title: '权限组维护',
                  visible: false,
                  roleId: '',
                  valid: '',
                  dataForm: {
                      roleId: '',
                      semiId:[]
                  },
                  props: {
                      label: 'name',
                      children: 'zones',
                      isLeaf: 'leaf'
                  },
                  roleGroups: [],
                  treeData: [],
                  defaultProps: {
                      label: 'label',
                      children: 'children',
                      parentId: 'parentId',
                      id: 'id'
                  },
                  // 默认选中的
                  checkedId: [],
                  // 默认展开
                  defaultCheckedId: [],
                  loading: false,
                  data:[],
                  nodeId:'',
                  getRoleDeptsData:[],
              }
          },
          methods: {
              async initItemPermissions(params) {
                  this.articlesData = null
                  const that = this
                  that.roleId = ''
                  // eslint-disable-next-line no-unused-vars
                  const dataChange = []
                  that.roleId = params.roleId
                  this.visible = true
              },
              loadNode(node, resolve) {
                  this.nodeId = node.id
                  let params
                  if (node.level == 0) {
                      // 获得parentId = -1 的树
                      params = {
                          'roleId': this.roleId,
                          'parentId': '-1'
                      }
                  } else {
                      params = {
                          'roleId': this.roleId,
                          'parentId': node.data.id
                      }
                  }
                  getTreeByRole(params).then((data) => {
                      if (data.resultdata.length > 0) {
                        const paramsNew  = {
                            roleId:this.roleId,
                        }
                        getRoleDepts(paramsNew).then((result) =>{
                            if(result.code == 0){
                                this.getRoleDeptsData = result.data.res_data;
                                data.resultdata.forEach((item1)=>{
                                    result.data.res_data.forEach((item2)=>{
                                        if(item1.id === item2.deptId){
                                            item1.CHECKEDID = 1
                                            // i.checked = true;
                                            // node.childNodes && node.childNodes.forEach(cell => {
                                            //     if (cell.data.CHECKEDID == 1) {
                                            //         cell.checked = true;
                                            //     } else {
                                            //         cell.checked = false
                                            //     }
                                            // });
                                        }
                                    })
                                })
                                
                            }
                        })
                        resolve(data.resultdata)
                      }  else {
                          resolve()
                      }
                  })
              },
  
              // 表单提交
              async onSubmit() {
                  //更新用户的保存状态机制
                  const params = [];
                    this.getRoleDeptsData.forEach((item) => {
                        params.push({
                            deptId: item.deptId,
                            roleId: this.roleId,
                        });
                    });
                    updateRoleSetDept(params).then((reslut) => {
                        if (reslut.code == 0) {
                        this.$message({
                            message: "操作成功",
                            type: "success",
                        });
                        this.visible = false
                        }
                    });

              },
              //关闭弹框的事件
              closeDialog() {
                  this.visible = false
                  this.$emit('onAddSuccess', this.visible)
              }
          }
      }
  </script>
  
  <style scoped>
  
  </style>
  